import {
  House,
  Monitor,
  Brush,
  Box,
  VideoCamera,
  Operation,
  PartlyCloudy,
  Sunny,
  Picture,
  MagicStick,
  Edit,
} from '@element-plus/icons-vue'

export interface MenuItem {
  index: string
  title: string
  icon?: unknown
  route?: string
  children?: MenuItem[]
}

export const menuConfig: MenuItem[] = [
  {
    index: '/',
    title: '首页',
    icon: House,
    route: '/',
  },
  {
    index: '/basic',
    title: '基础概念',
    icon: Monitor,
    children: [
      {
        index: '/basic/introduction',
        title: 'WebGL介绍',
        route: '/basic/introduction',
      },
      {
        index: '/basic/canvas',
        title: 'Canvas基础',
        route: '/basic/canvas',
      },
      {
        index: '/basic/shader',
        title: '着色器',
        route: '/basic/shader',
      },
    ],
  },
  {
    index: '/shapes',
    title: '基础图形',
    icon: Brush,
    children: [
      {
        index: '/shapes/point',
        title: '点',
        route: '/shapes/point',
      },
      {
        index: '/shapes/line',
        title: '线',
        route: '/shapes/line',
      },
      {
        index: '/shapes/triangle',
        title: '三角形',
        route: '/shapes/triangle',
      },
      {
        index: '/shapes/gradient-triangle',
        title: '渐变三角形',
        route: '/shapes/gradient-triangle',
      },
    ],
  },
  {
    index: '/matrix',
    title: '矩阵变换',
    icon: Operation,
    children: [
      {
        index: '/matrix/2d',
        title: '二维矩阵变换',
        route: '/matrix/2d',
      },
      {
        index: '/matrix/3d',
        title: '三维矩阵变换',
        route: '/matrix/3d',
      },
    ],
  },
  {
    index: '/complex',
    title: '复杂图形',
    icon: Box,
    children: [
      {
        index: '/complex/webgl-letter',
        title: 'WEBGL字母',
        route: '/complex/webgl-letter',
      },
      {
        index: '/complex/snowflake',
        title: '雪花图形',
        route: '/complex/snowflake',
      },
      {
        index: '/complex/turtle-graphics',
        title: '海龟绘图',
        route: '/complex/turtle-graphics',
      },
    ],
  },
  {
    index: '/simple-3d',
    title: '简单三维',
    icon: PartlyCloudy,
    children: [
      {
        index: '/simple-3d/cube',
        title: '立方体',
        route: '/simple-3d/cube',
      },
    ],
  },
  {
    index: '/texture',
    title: '纹理贴图',
    icon: Picture,
    children: [
      {
        index: '/texture/basic',
        title: '基础贴图',
        route: '/texture/basic',
      },
      {
        index: '/texture/cube-map',
        title: '立方体贴图',
        route: '/texture/cube-map',
      },
      {
        index: '/texture/normal-map',
        title: '法线贴图',
        route: '/texture/normal-map',
      },
      {
        index: '/texture/hdr-map',
        title: 'HDR贴图',
        route: '/texture/hdr-map',
      },
    ],
  },
  {
    index: '/lighting',
    title: '光照效果',
    icon: Sunny,
    children: [
      {
        index: '/lighting/point-light',
        title: '点光源',
        route: '/lighting/point-light',
      },
      {
        index: '/lighting/directional-light',
        title: '平行光源',
        route: '/lighting/directional-light',
      },
    ],
  },
  {
    index: '/shadertoy',
    title: 'Shadertoy',
    icon: VideoCamera,
    children: [
      {
        index: '/shadertoy/blackhole',
        title: '旋转黑洞',
        route: '/shadertoy/blackhole',
      },
      {
        index: '/shadertoy/circle',
        title: '炫光圆圈',
        route: '/shadertoy/circle',
      },
      {
        index: '/shadertoy/color-ring',
        title: '彩色旋转光圈',
        route: '/shadertoy/color-ring',
      },
      {
        index: '/shadertoy/glow',
        title: '光晕效果',
        route: '/shadertoy/glow',
      },
      {
        index: '/shadertoy/windmill',
        title: '风车效果',
        route: '/shadertoy/windmill',
      },
      {
        index: '/shadertoy/starfield',
        title: '闪耀星际',
        route: '/shadertoy/starfield',
      },
      {
        index: '/shadertoy/sdf-curve',
        title: 'SDF曲线',
        route: '/shadertoy/sdf-curve',
      },
    ],
  },
  {
    index: '/post-processing',
    icon: MagicStick,
    title: '后处理效果',
    children: [
      {
        index: '/post-processing/blur',
        title: '模糊效果',
        route: '/post-processing/blur',
      },
      {
        index: '/post-processing/edge-detection',
        title: '边缘检测',
        route: '/post-processing/edge-detection',
      },
      {
        index: '/post-processing/tone-mapping',
        title: '色调映射',
        route: '/post-processing/tone-mapping',
      },
      {
        index: '/post-processing/anti-aliasing',
        title: '抗锯齿',
        route: '/post-processing/anti-aliasing',
      },
    ],
  },
  {
    index: '/playground',
    title: '在线编辑器',
    icon: Edit,
    children: [
      {
        index: '/playground/editor',
        title: 'WebGL编辑器',
        route: '/playground/editor',
      },
    ],
  },
]
